<template>
  <div>
      <div class="header">
          <span>设备告警管理</span>
      </div>
      <header-top :total='total'></header-top>
      <index-table :total='total'></index-table>
      <equipment-detail ref="detail"></equipment-detail>
  </div>
</template>

<script>
import indexTable from './components/IndexTable.vue';
import headerTop from './components/HeaderTop.vue'
import equipmentDetail from './components/detail.vue';
import {getAction} from '@/api/manage';
export default {
  components:{indexTable, headerTop, equipmentDetail},
  data() {
        return {
            dialog: false,
            total: 0,
            baseId: ''
        }
    },
    methods: {
        // 获取设备详情
        getEquipmentdetail(){
            let child = this.$refs.detail;
            getAction(`/sys/getDetail/${this.baseId}`).then(res=>{
                console.log(res);
                for(let i in res.bbxx){
                    child.form[i] = res.bbxx[i]
                }
                for(let i in res.glxx){
                    child.form[i] = res.glxx[i]
                }
                for(let i in res.sbxx){
                    child.form[i] = res.sbxx[i]
                }
                console.log(child.form);
                this.dialog = true;
            })
        },
    }
}
</script>

<style scoped>
    .header{
        height: 20px;
        background-color: transparent;
        box-shadow: none;
        padding: 0;
    }
  .header span{
        position: relative;
        font-size: 18px;
        line-height: 20px;
        color: #333;
        margin-left: 5px;
        padding-left: 8px;
    }
    .header span::before{
        content:'';
        height: 20px;
        position: absolute;
        left: 0;
        width: 4px;
        border-radius: 2px;
        background: #2F70E6;
    }
</style>